<template>
  <!-- 风险清单 -->
  <div class="systemDas">
    <div class="systemDasDiv">
      <div class="systemDas_main">
        <h1>标题名称</h1>
        <p>{{listArr.FileName}}</p>
      </div>
      <div class="systemDasDiv_top">
        <ul class="ul11">
          <li class="clearfix">
            <span class="spa">文号/标准号</span>
            <em>{{listArr.FileNumber}}</em>
          </li>
          <li class="clearfix">
            <span class="spa">发布日期</span>
            <em>{{listArr.PublishDate}}</em>
          </li>
          <li class="clearfix">
            <span class="spa">实施日期</span>
            <em>{{listArr.ImplementDate}}</em>
          </li>
          <li class="clearfix">
            <span class="spa">发布机关</span>
            <em>{{listArr.PromulgateDepart}}</em>
          </li>
          <li class="clearfix">
            <span class="spa">效力级别</span>
            <em>{{listArr.Area}}</em>
          </li>
          <li class="clearfix">
            <span class="spa">时效性</span>
            <em>{{listArr.AgingName}}</em>
          </li>
          <!-- <li class="clearfix">
            <span class="spa">附件信息</span>
            <em>默认本单位</em>
          </li> -->
        </ul>
        <!-- <div class="queryBtn"><a target="_blank" :href="menu7">全文预览</a></div> -->
        <div class="queryBtn" @click="goPreview(menu7)">全文预览</div>
      </div>
    </div>
    <!-- <p v-if="!nodata" class="noDestail">暂无数据...</p> -->
    <noData v-if="listArr == 0"></noData>
    <myMenu @clickBack="back"></myMenu>
    <a :href="menu7"></a>
  </div>
</template>
<script>
import { Actionsheet, Datetime, Radio } from 'vux'
import myMenu from '@/commonComponents/menu'
export default {
  components: {
    Radio,
    myMenu,
    Datetime,
    Actionsheet
  },
  data () {
    return {
      menu7: '',
      show: false,
      name1: '',
      name2: '',
      name3: '',
      listArr: {
          FileName: '',
          Area: '',
          ImplementDate: '',
          PublishDate: '',
          FileNumber: '',
          PromulgateDepart: '',
          FileDownPath: '',
          Category: '',
          AgingName: '',
          Attachments: []
      },
      nodata: true,
      userId: ''
    }
  },
  created () {
    var token = JSON.parse(window.localStorage.getItem('userInfo'))
    this.userId = token.userid
    this.getInfo()
  },
  mounted () {
    var token = JSON.parse(window.localStorage.getItem('userInfo'))
    this.userId = token.userid
   this.getInfo()
  },
  methods: {
    back () {
      window.sessionStorage.removeItem('name1')
      window.sessionStorage.removeItem('departId')
      window.sessionStorage.removeItem('name2')
      window.sessionStorage.removeItem('name3')
    },
    go2 () {
      window.sessionStorage.clear()
      this.$router.push('./riskMonitoring')
    },
    go3 () {
      window.sessionStorage.clear()
      this.$router.push('./riskInfo')
    },
    go4 () {
      window.sessionStorage.clear()
      this.$router.push('./riskInfo')
    },

    getInfo () {
      let itemId = this.$route.query.Id
      let param = {
        allowPaging: true,
        business: 'StatuteDetails',
        data: itemId,
        pageIndex: 0,
        pageSize: 0,
        tokenId: '',
        userId: this.userId
      }
      this.$axiosAjax.getConfigJson(param).then((res) => {
               this.listArr = res.data.data
               this.menu7 = this.listArr.FileDownPath
      })
    },
    // 预览
    goPreview (path) {
        // console.log(path)
        if (path) {
            this.$router.push({
                path: '/listmenus',
                query: {
                    src: path
                }
            })
        }
    }
  }
}
</script>
<style lang="less" scope>
.systemDas {
  width: 100%;
  height: 100%;
  background-color: #ebeef3;
  .systemDasDiv {
    width: 100%;
    background-color: #ebeef3;
    .systemDas_main {
      height: 60px;
      line-height: 60px;
      width: 100%;
      padding: 4px 10px 0;
      background-color: #fff;
      margin-bottom: 10px;
      h1 {
        height: 30px;
        line-height: 30px;
        font-size: 14px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: #343434;
      }
      p {
        height: 20px;
        line-height: 20px;
        font-size: 14px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: #666;
      }
    }
    .systemDasDiv_top {
      width: 100%;
      padding-bottom: 1px;
      background-color: #fff;
      .ul11 {
        padding: 0 10px;
        li {
          padding: 10px 0;
          border-bottom: 1px solid #eee;
          width: 100%;
          height: 50px;
          line-height: 30px;
          position: relative;
          font-size: 16px;
          display: flex;
          .vux-x-icon {
            fill: #999;
            float: right;
            position: absolute;
            width: 20px;
            height: 20px;
            top: 14px;
            right: -10px;
          }
          .spa {
            float: left;
            height: 30px;
            line-height: 30px;
            width: 140px;
            font-size: 14px !important;
            line-height: 30px !important;
            color: #333;
          }
          em {
            float: right;
            color: #999;
            width: 200px;
            height: 30px;
            font-size: 14px;
            line-height: 30px;
            text-align: right;
            margin-right: 10px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            div {
              float: right;
              margin-left: 20px;
              width: 26%;
              position: relative;
              text-align: right;
              color: #999;
              input {
                width: 16px;
                height: 16px;
                position: absolute;
                top: 6px;
                left: 10px;
                text-align: center;
              }
            }
          }
          .weui-cell {
            // display: none;
            padding: 0;
          }
          .weui-cell_access {
            width: 220px;
          }
          .vux-cell-value {
            float: right;
          }
        }
      }
      .queryBtn {
        height: 40px;
        line-height: 40px;
        left: 40px;
        margin: 25px auto;
        text-align: center;
        width: 200px;
        border-radius: 25px;
        background-color: #2269ff;
        letter-spacing: 4px;
        color: #fff;
        a{
           color: #fff;
        }
      }
    }
  }
  .noDestail {
    background-color: #fff;
    padding: 0 10px;
    height: 50px;
    line-height: 50px;
  }
  .weui-actionsheet {
    top: 50%;
    // width: 90%;
    // left: 20px;
    background-color: rgba(0, 0, 0, 0);
  }
  .weui-actionsheet__menu {
    margin: 0 auto;
    width: 90%;
    height: 300px;
    overflow-y: auto;
    line-height: 20px;
    border-radius: 10px;
  }
  .vux-actionsheet-menu-default {
    padding: 10px !important;
    text-align: left;
  }
}
</style>
